<!DOCTYPE html>
<html>
<head>
<title>Fullscreen</title>
<script type="text/javascript">
function launchIntoFullscreen(element) {
  if(element.requestFullscreen) {
    element.requestFullscreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();
  }
}
function exitFullscreen() {
  if(document.exitFullscreen) {
    document.exitFullscreen();
  } else if(document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if(document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
  }
}

</script>
</head>
<body>
<div id="videoElement">
	<h2>Launching <a href="javascript:launchIntoFullscreen(document.documentElement);" >Fullscreen</a> Mode</h2>
	<h2>Launching videoElement <a href="javascript:launchIntoFullscreen(document.getElementById('videoElement'));" >Fullscreen</a> Mode</h2>
	<p>The fullscreen API's <code>requestFullscreen</code> method is still prefixed in some browsers, so you'll need to do a bit of searching to find it:</p>
</div>
<div id="videoElement2">
	<h2>Exiting <a href="javascript:exitFullscreen(document.documentElement);" >Fullscreen Mode</a></h2>
	<p>The <code>exitFullscreen</code> method (also prefixed in older browsers) morphs the browser chrome&nbsp;back into standard layout:</p>
</div>
</body>
</html>